import { Component, OnInit, OnDestroy, DoCheck, Output,Input, EventEmitter } from '@angular/core';
// import { Subscription, from } from 'rxjs';
// import { RestProVider } from '../../../common/rest-pro-vider'
@Component({
  selector: 'app-city-area',//控件名称
  templateUrl: './city-area.component.html',
  styleUrls: ['./city-area.component.scss'],
})
export class CityAreaComponentComponent implements OnInit, OnDestroy, DoCheck {
  // 结果码 (用于页面处理显示标识)
  result_code: number;
  data: Country[];
  // 市级实体声明
  city: City[];
  // 县区级实体声明
  country: Country[];
  // 市县、区级填写实体声明
  cac: CityAndCountry;
  // 声明订阅对象
  // subscript: Subscription;
  tempcityid;
  tempcountryid;
  customAlertOptions: any = {
    header: '请选择',
    translucent: true
  };

  @Input() type = '0'; //输入参数
  @Output() provinceOut = new EventEmitter();//输出参数
  /**
    * 构造器
    * @param {CityService} service 注入服务
    */
  constructor(
    // private rest: RestProVider,
  ) {
    // 结果码 (-1.网络或其他异常 0.无内容 1.请求成功 2.请等待)
    this.result_code = 2;
    // 初始化填写市区、县级填写实体
    this.cac = new CityAndCountry();
    // 初始化数组(这步很重要，有很多人说使用数组相关函数会报未定义异常，是因为没有初始化的原因)
    this.city = [];
    this.country = [];
    // 初始化订阅对象
    // this.subscript = new Subscription();
  }

  /**
  * 生命周期初始化钩子(生命周期尽量按执行顺序来写，养成好习惯)
  */
  ngOnInit(): void {
    this.getCityArea();
  }
  /** 获取数据 */
  getCityArea() {
    if(this.type === '0'){


    this.data =[
     {
        TITLE: '标题1',
        UNIT: 'string',
        PCODE: '0',
        CODE: '1'
      },
     {
        TITLE: '标题2',
        UNIT: 'string',
        PCODE: '0',
        CODE: '2'
      },
      {
        TITLE: '标题3',
        UNIT: 'string',
        PCODE: '0',
        CODE: '3'
      }, {
        TITLE: '标题4',
        UNIT: 'string',
        PCODE: '0',
        CODE: '4'
      }, {
        TITLE: '标题12',
        UNIT: 'string',
        PCODE: '1',
        CODE: '11'
      },
      {
        TITLE: '标题13',
        UNIT: 'string',
        PCODE: '1',
        CODE: '13'
      }, {
        TITLE: '标题21',
        UNIT: 'string',
        PCODE: '2',
        CODE: '21'
      }, {
        TITLE: '标题22',
        UNIT: 'string',
        PCODE: '2',
        CODE: '22'
      },
      {
        TITLE: '标题23',
        UNIT: 'string',
        PCODE: '2',
        CODE: '23'
      }, {
        TITLE: '标题31',
        UNIT: 'string',
        PCODE: '3',
        CODE: '31'
      },
    ]
  }else  {
    
    this.data =[
      {
         TITLE: '1标题1',
         UNIT: 'string',
         PCODE: '0',
         CODE: '1'
       },
      {
         TITLE: '1标题2',
         UNIT: 'string',
         PCODE: '0',
         CODE: '2'
       },
       {
         TITLE: '1标题3',
         UNIT: 'string',
         PCODE: '0',
         CODE: '3'
       }, {
         TITLE: '1标题4',
         UNIT: 'string',
         PCODE: '0',
         CODE: '4'
       }, {
         TITLE: '1标题12',
         UNIT: 'string',
         PCODE: '1',
         CODE: '11'
       },
       {
         TITLE: '1标题13',
         UNIT: 'string',
         PCODE: '1',
         CODE: '13'
       }, {
         TITLE: '1标题21',
         UNIT: 'string',
         PCODE: '2',
         CODE: '21'
       }, {
         TITLE: '1标题22',
         UNIT: 'string',
         PCODE: '2',
         CODE: '22'
       },
       {
         TITLE: '1标题23',
         UNIT: 'string',
         PCODE: '2',
         CODE: '23'
       }, {
         TITLE: '1标题31',
         UNIT: 'string',
         PCODE: '3',
         CODE: '31'
       },
     ]
  }
    // this.city.push(new Country{}};

    // this.rest.getcarcotypes().subscribe(f => {

    //   if (f["success"] == "true") {
    //     // debugger
    //     this.data = f["data"];
        for (let i = 0; i < this.data.length; i++) {
          /** 若选择的市级id和市级数组中的id相吻合 */
          if (this.data[i].PCODE === '0') {
            // /** 将该索引下的counties数组赋予给区县级数组 */
            this.city.push(this.data[i]);
          }
        }

    //   } else {
    //   }
    // }, error =>
    //     <any>error
    // );

  }
  /** 生命周期销毁钩子 */
  ngOnDestroy(): void {
    /** 取消订阅 */
    // this.subscript.unsubscribe();
  }
  /** 生命周期检测变化钩子 */
  ngDoCheck(): void {
    /** 遍历市级数组 */
    // debugger
    if (this.tempcityid != this.cac.cityId) {
      if (this.cac.cityId != undefined && this.cac.cityId != '') {
        this.country = [];
        this.cac.countryId = '';
        this.tempcountryid = '';
        // this.provinceOut.emit(this.cac);//返回值
        for (let i = 0; i < this.data.length; i++) {
          /** 若选择的市级id和市级数组中的id相吻合 */
          if (this.data[i].PCODE === this.cac.cityId) {
            // /** 将该索引下的counties数组赋予给区县级数组 */
            this.country.push(this.data[i]);
          }
        }
      }
      this.tempcityid = this.cac.cityId
    }
    if (this.tempcountryid != this.cac.countryId) {
      this.tempcountryid == this.cac.countryId
      if (this.cac.countryId != undefined && this.cac.countryId != '') {
        this.provinceOut.emit(this.cac);//返回值
      }
    }
  }

}


// 市级实体类
export class City {

  counties?: Array<Country>;
  TITLE: String;
  UNIT: string;
  PCODE: string;
  CODE: string;
}

// 区县级实体类
export class Country {
  TITLE: String;
  UNIT: string;
  PCODE: string;
  CODE: string;
}

// 填写市县类
export class CityAndCountry {
  // 市级id
  cityId: string;
  // 县级id
  countryId: string;
  // 市县级实体构造器 
  constructor() {
    // 给市级id赋予一个真实城市的id初始值
    this.cityId = '';
    // 同上
    this.countryId = '';

  }
}
